﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="ProductDetail.aspx.cs"
    Inherits="Maticsoft.Web.wap.ProductDetail" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <!--#include file="include/head.htm"-->
    <style type="text/css">
        #divLay span
        {
            border: 1px solid #ccc;
            padding: 3px;
            cursor: pointer;
            margin: 3px 5px;
            display:inline-block;
        }
        #divLay .active
        {
            border: 1px solid #FF0000;
        }
        .drgbox img
        {
            width: 100%;
            text-align: center;
        }
    </style>
    <script type="text/javascript">
        function Buy() {
            window.location.href = "ShoppingCar.aspx?d=" + new Date().toString();
        }

        function AddShoppingCar(op) {
            if ($("#divLay .active").length == 0) {
                alert("请选择规格");
                return;
            }
            if ($("txtNum").val() == "") {
                alert("请选择数量");
                return;
            }

            $.ajax({
                type: "get",
                url: "ProductDetail.aspx",
                data: "ope=addnum&productId=" + $("#hidProductId").val() + "&num=" + $("#txtNum").val() + "&lay=" + $("#divLay .active").text() + "&d=" + new Date().toString(),
                success: function (data) {
                    if (data == "1") {
                        if (op == "1") {
                            Buy();
                            return;
                        }
                        alert("添加成功");
                    }
                    else if (data == "-1") {
                        alert("产品已下架");
                    }
                    else if (data == "-2") {
                        alert("库存不足");
                    }
                    else if (data == "-3") {
                        alert("超出购买限额");
                    }
                    else if (data == "-4") {
                        alert("超出购买限额");
                    }
                    else if (data == "-5") {
                        alert("请先登录");
                        window.location.href = "login.aspx";
                    }
                    else {
                        alert("添加失败");
                    }
                },
                error: function () {
                    alert("出错啦");
                }
            })
        }

        function GetShopCar() {
            $.ajax({
                type: "get",
                url: "ProductDetail.aspx",
                data: "ope=carnum&d=" + new Date().toString(),
                success: function (msg) {
                    if (msg != "") {
                        $("#carNum").text(msg);
                    }
                },
                error: function (msg) {

                }
            })
        }

        function AddNum(i) {
            var n = $("#txtNum").val();
            var num = parseInt(i) + parseInt(n);
            if (num > 0) {
                $("#txtNum").val(num);
            }
            else {
                $("#txtNum").val("1");
            }
        }

        function SelLayout(obj) {
            $("#divLay span").removeClass("active");
            $(obj).addClass("active")
        }

        function GoShop() {
            window.location.href = "ShoppingCar.aspx";
        }

        $(function () {
            GetShopCar();
        })
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <asp:HiddenField ID="hidProductId" runat="server" />
    <header class="mui-bar">
            <a class="mui-action-back gotoup mui-pull-left"></a>
			<h1 class="mui-title" style="right:80px;">商品详情</h1>
			<a class="mui-pull-right tc-black"><img src="img/2_62.png" class="icons-car" onclick="GoShop();"><span class="tc-white mui-badge" id="carNum" style="position:absolute;top:2px;right:2px; background-color: #ef0000;"></span></a>
            <a class="mui-pull-right tc-black" href="default.aspx"><img src="img/home.png" class="icons-car"></a>
		</header>
    <div class="mui-content">
        <div id="slider" class="mui-slider">
            <div class="mui-slider-group mui-slider-loop" id="proPic" runat="server">
            </div>
            <div class="mui-slider-indicator" id="proPicDiv" runat="server">
            </div>
        </div>
        <div class="mui-row bg-white mar-btm-10 pad-10" style="margin-bottom:10px">
            <h5 class="tc-black">
                <asp:Literal ID="ltlProductName" runat="server"></asp:Literal></h5>
            <h4 class="tc-red">
                <span class="mui-h5 tc-red">￥</span><asp:Literal ID="ltlSalePrice" runat="server"></asp:Literal></h4>
        </div>
        <div class="mui-row bg-white mar-btm-10 mui-table-view-cell" style="margin-bottom:10px">
            <a class="mui-navigate-right tc-black" href="javascript:;">产品编号：<asp:Literal ID="ltlNum" runat="server"></asp:Literal></a>
        </div>
        <div class="mui-row bg-white mar-btm-10 mui-table-view-cell" style="margin-bottom:10px">
            <a class="mui-navigate-right tc-black" href="javascript:;">商品重量：<asp:Literal ID="ltlWeight" runat="server"></asp:Literal></a>
        </div>
        <div class="mui-row bg-white mar-btm-10 mui-table-view-cell" style="margin-bottom:10px">
            <a class="mui-navigate-right tc-black" href="javascript:;">选择规格 </a>
        </div>
        <div class="mui-row bg-white mar-btm-10 mui-table-view-cell" id="divLay" style="margin-bottom:10px">
            <asp:Literal ID="ltlLay" runat="server"></asp:Literal>
        </div>
        <div class="mui-row bg-white mar-btm-10 mui-table-view-cell" style="margin-bottom:10px">
            <a class="mui-navigate-right tc-black" href="javascript:;">选择数量：<span style="display:inline-block;width:15px; cursor:pointer; text-align:center;" onclick="AddNum(-1)">-</span><input id="txtNum" type="text" value="1" style="width:40px;height:30px; padding:0px; text-align:center; margin:0px;" /><span style="display:inline-block;width:15px; cursor:pointer; text-align:center;" onclick="AddNum(1);">+</span></a>
        </div>
        <div class="mui-row bg-white mar-btm-10" style="border-bottom-color: transparent;">
            <div class="mui-row mui-table-view-cell">
                <a class="mui-navigate-right tc-black" href="ProductComments.aspx?id=<%=Request.QueryString["id"] %>">商品评价(<asp:Literal ID="ltlCount" runat="server"></asp:Literal>) </a>
            </div>
            <div class="mui-row">
                <ul class="mui-table-view">
                    <asp:Repeater ID="Repeater1" runat="server">
                    <ItemTemplate>
                    <li class="mui-table-view-cell">
                        <h5 style="padding: 0 0 5px 0; overflow: hidden;">
                            <%#GetStar(Eval("Point"))%>
                            <span class="mui-h5 tc-lgray mui-pull-right"><%#Eval("NickName")%></span>
                        </h5>
                        <h5 class="tc-black">
                            <%#Eval("Detail")%></h5>
                    </li>
                    </ItemTemplate>
                    </asp:Repeater>
                </ul>
            </div>
            <div class="mui-row drgbox" style="text-align:left; line-height:20px; padding:5px;">
                <asp:Literal ID="ltlDetail" runat="server"></asp:Literal>
            </div>
        </div>
        <div class="fix-btm-0">
            <div class="mui-col-xs-6 mui-pull-left">
                <button class="mui-btn-link" type="button" style="border-radius: 0; background-color: #ff9402;" onclick="AddShoppingCar('0');">
                    加入购物车</button>
            </div>
            <div class="mui-col-xs-6 mui-pull-left">
                <button class="mui-btn-link" type="button" style="border-radius: 0;" onclick="AddShoppingCar('1');">
                    立即购买</button>
            </div>
        </div>
    </div>
    </form>
</body>
</html>
<script type="text/javascript" charset="utf-8">
    var gallery = mui('.mui-slider');
    gallery.slider({
        interval: 0 //自动轮播周期，若为0则不自动播放，默认为0；
    });
    (function () {
        $('.btm-box .mui-col-xs-3').click(function () {

            $(this).children('h6').css({
                'color': '#e4393c'
            });
        })
    })
</script>
